import { createStore } from 'vuex'

// 初始的 state 对象
let initState = {
  // token 的信息对象
  tokenInfo: {},
  // 用户的基本信息
  userInfo: {},
  pictureInfo: {},
  historyList: {}
}

const stateStr = localStorage.getItem('state')

if (stateStr) {
  // 加载本地的数据
  initState = JSON.parse(stateStr)
}

export default createStore({
  // 为 state 赋初值
  state: initState,
  // commit触发
  mutations: {
    // 更新 tokenInfo 数据的方法
    updateTokenInfo (state, payload) {
      state.tokenInfo = payload
      this.commit('saveStateToStorage', payload)
    },
    // 更新 tokenInfo 数据的方法
    updateHistoryList (state, payload) {
      state.historyList = payload
      this.commit('saveStateToStorage', payload)
    },
    // 更新 pictureInfo 数据的方法
    updatePictureInfo (state, payload) {
      state.pictureInfo = payload
      this.commit('saveStateToStorage', payload)
    },
    // 将 state 持久化存储到本地
    saveStateToStorage (state) {
      localStorage.setItem('state', JSON.stringify(state))
    },
    // 更新 userInfo 的方法
    updateUserInfo (state, payload) {
      // 1. 把用户信息转存到 state 中
      state.userInfo = payload
      // 2. 将最新的 state 对象持久化存储到本地
      this.commit('saveStateToStorage')
    },
    // 清空 vuex 和本地的数据
    cleanState (state) {
      // 1. 清空 vuex 中的数据
      state.tokenInfo = {}
      state.userInfo = {}

      // 2. 将清空后的 state 存储到本地
      this.commit('saveStateToStorage')
    }
  },
  actions: {
    // 初始化用户的基本信息
    async initUserInfo (token, ctx) {
      const { data: res } = await this.$http({
        url: '/my/userinfo',
        method: 'GET',
        headers: {
          'Access-Control-Allow-Origin': '*', // 解决cors头问题
          'Access-Control-Allow-Credentials': 'true', // 解决session问题
          Authorization: token
        }
      })
      if (res.status === 0) {
        // TODO：把数据转交给 Mutation 方法
        ctx.commit('updateUserInfo', res.data)
      }
    }
  }
})
